<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript" src="../js/jquery-3.3.1.js"></script>
<body>
	<p>车辆进入停车场</p>
	车牌号<input id="carlicensein">&nbsp;&nbsp;
	停车区<select id="areaNo">
		</select>
	<span id="remain"></span>
	<input id="in" type="submit" value="登记">
	<p>车辆驶出停车场</p>
	车牌号<input id="carlicenseout">&nbsp;&nbsp;
	<input id="billing" type="submit" value="计费">
	<input id="out" type="submit" value="登出">
	<p id="msg"></p>
</body>
<script type="text/javascript">
	$(function(){
		//获取分区
		$.ajax({
			url:'getparkingarea',
			method:'get',
			contentType:'application/json',
			dataType:'json',
			success:function(data){
				remainSpace(data[0].zoneParkingId);
				$.each(data,function(){
					var option = "<option value='"+this.zoneParkingId+"'>"+this.zoneParkingName+"</option>";
					$("#areaNo").append(option);
				});
			}
		});
		//剩余车位显示
		$("#areaNo").change(function(){
			remainSpace($("#areaNo").val());
		});
		function remainSpace(areaNo){
			$.ajax({
				url:'remainspace',
				method:'get',
				contentType:'application/json',
				dataType:'json',
				data:{'parkingArea':areaNo},
				success:function(data){
					$("#remain").html("剩余车位:"+data);
				}
			});
		}
		//车辆进入登记
		$("#in").click(function(){
			var parkingStartTime = new Date();
			var parkingArea = $("#areaNo").val();
			var carlicensein = $("#carlicensein").val();
			if(carlicensein != ""){
				$.ajax({
					url:'carin',
					method:'get',
					contentType:'application/json',
					dataType:'json',
					data:{
						'parkingStartTime':parkingStartTime,
						'parkingArea':parkingArea,
						'carlicense':carlicensein
					},
					success:function(data){
						if(!data)
							$("#msg").html("该车已进入停车场");	
						remainSpace($("#areaNo").val());
					}
				})
				$("#carlicensein").val("");
			}
		});
		//停车计费
		$("#billing").click(function(){
			var carlicense = $("#carlicenseout").val();
			var parkingEndTime = new Date();
			$.ajax({
				url:'checkparking',
				method:'get',
				contentType:'application/json',
				dataType:'json',
				data:{
					'carlicense':carlicense
				},
				success:function(data){
					if(data){
						$.ajax({
							url:'billing',
							method:'get',
							contentType:'application/json',
							dataType:'json',
							data:{
								'carlicense':carlicense,
								'parkingEndTime':parkingEndTime
							},
							success:function(data){
								$("#msg").html("停车费用:"+data);
							}
						})
					}else{
						$("#msg").html("该车不在停车场内");
					}
				}
			})
		});	
		//车辆驶出
		$("#out").click(function(){
			var carlicense = $("#carlicenseout").val();
			$.ajax({
				url:'carout',
				method:'get',
				contentType:'application/json',
				dataType:'json',
				data:{
					'carlicense':carlicense
				},
				success:function(data){
					if(data){
						$("#carlicenseout").val("");
						remainSpace($("#areaNo").val());
						$("#msg").html("车辆成功驶出停车场");
					}else{
						$("#msg").html("该车不在停车场内");
					}
				}
			});
		});
		
	})
</script>
</html>